import React from 'react';
import Svg, {G, Path, Defs, ClipPath, Rect} from 'react-native-svg';
import {BasicsProps} from './type';

type Props = {
  size: string;
  fill?: string; // 渐变开始颜色
} & BasicsProps;

const OpenToRightIcon = ({size, fill = '#333333'}: Props) => {
  return (
    <Svg
      width={size}
      height={size}
      viewBox="0 0 14 14"
      fill="none">
      <G
        id="&#229;&#177;&#149;&#229;&#188;&#128;"
        clip-path="url(#clip0_31_259)">
        <G id="Iconly/Light-Outline/Arrow---Right-2">
          <G id="Arrow---Right-2">
            <Path
              id="Stroke-1"
              d="M4.04972 12.5124C3.85481 12.3175 3.83709 12.0125 3.99656 11.7976L4.04972 11.736L8.78544 7.00002L4.04972 2.26405C3.85481 2.06913 3.83709 1.76412 3.99656 1.54919L4.04972 1.48762C4.24463 1.2927 4.54964 1.27498 4.76457 1.43446L4.82615 1.48762L9.95033 6.6118C10.1452 6.80671 10.163 7.11172 10.0035 7.32665L9.95033 7.38823L4.82615 12.5124C4.61175 12.7268 4.26413 12.7268 4.04972 12.5124Z"
              fill={fill}
            />
          </G>
        </G>
      </G>
      <Defs>
        <ClipPath id="clip0_31_259">
          <Rect width="14" height="14" fill="white" />
        </ClipPath>
      </Defs>
    </Svg>
  );
};


export default OpenToRightIcon;
